<template>
  <el-form ref="ruleFormRef" :model="state.form" v-loading="loading">
    <pub-edit-description :ndColumns="2">
      <pub-edit-description-item :span="1" label="使用场景" required>
        <el-form-item prop="sceneType" :rules="$formRules.select">
          <pub-select-dict
            style="width: 100%"
            v-model="state.form.sceneType"
            dict-code="CLSYCJLX"
            placeholder="请选择"
          />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="材料类型标识" required>
        <el-form-item prop="bizType" :rules="$formRules.input">
          <pub-input :disabled="!!props.currentId" v-model="state.form.bizType" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="材料类型标识名称" required>
        <el-form-item prop="bizTypeName" :rules="$formRules.input">
          <pub-input v-model="state.form.bizTypeName" />
        </el-form-item>
      </pub-edit-description-item>
      <pub-edit-description-item :span="1" label="状态" required>
        <el-form-item prop="status" :rules="$formRules.select">
          <pub-select-dict
            style="width: 100%"
            v-model="state.form.status"
            :disabled="!!props.currentId"
            dict-code="ZDZT"
            type="Number"
            placeholder="请选择"
          />
        </el-form-item>
      </pub-edit-description-item>
    </pub-edit-description>
    <div class="dialog-footer-btn">
      <el-button @click="cancel">取消</el-button>
      <el-button v-prevent-repeat-click type="primary" @click="submitForm(ruleFormRef)">
        保存
      </el-button>
    </div>
  </el-form>
</template>

<script setup>
import { ElMessage } from 'element-plus'
import { getFileTypeDetailOrDelete, fileTypeUpdate } from '@/api/material.js'
const emit = defineEmits(['cancel'])
const loading = ref(false)
const props = defineProps({
  currentId: {
    type: String,
    default: ''
  }
})
const state = reactive({
  form: {}
})

const initDict = async () => {
  loading.value = true
  try {
    const res = await getFileTypeDetailOrDelete(props.currentId, 'get')
    if (res.data) {
      state.form = res.data
    }
    loading.value = false
  } catch (error) {
    loading.value = false
  }
}
const ruleFormRef = ref()

const cancel = () => {
  emit('cancel', false)
}

const submitForm = formEl => {
  if (!formEl) return
  formEl.validate(async valid => {
    if (valid) {
      loading.value = true
      // 添加子字典
      const res = await fileTypeUpdate(
        state.form,
        props.currentId ? 'put' : 'post'
      )
      if (res.succeed) {
        ElMessage({
          type: 'success',
          message: res.msg
        })
      }
      emit('cancel', false)
      loading.value = false
    } else {
      console.log('error submit!')
      return false
    }
  })
}

onMounted(() => {
  if (props.currentId) {
    initDict()
  }
})
</script>

<style scoped>
.options {
  height: 20px;
  line-height: 20px;
  text-align: center;
  margin-top: 10px;
}
</style>
